<template>
	<view>
		<!-- <u-navbar :is-back="true" :is-fixed="true" title="品牌积分榜"></u-navbar> -->
		<!-- <scroll-view scroll-y scroll-with-animation style="height: calc(100vh - 50px);" :show-scrollbar="false"> -->
		<view class="mt-3 pl-2 pr-2">
			<view v-for="(item, itemIndex) in tabContents" :key="itemIndex">
				<view class="dfex mt-3">
					<view class="dfes">
						<view
							:class="['pr-2 font-20', {'index-color-1': (itemIndex % 3) === 0 && itemIndex < 3, 'index-color-2': (itemIndex % 3) === 1 && itemIndex < 3, 'index-color-3': (itemIndex % 3) === 2 && itemIndex < 3, 'font-color-gray': itemIndex >= 3 }]">
							{{ itemIndex + 1 }}
						</view>
						<u-image style="width: 35px; height: 35px;" border-radius=" 100rpx" :src="item.avatarFull">
						</u-image>
						<text class="ml-2 font-14 text-333333">{{ item.enterpriseName }}</text>
					</view>
					<text class="text-78AB06 font-16">{{ item.totalIntegral }} 积分</text>
				</view>
			</view>
			<view v-if="!hasMore && tabContents.length > 0" class="text-center mt-3 mb-3">
				<view class="text-muted">没有更多数据了</view>
			</view>
			<view v-else-if="!hasMore && tabContents.length === 0" class="text-center mt-3 mb-3">
				<view class="text-muted">暂无数据</view>
			</view>
			<view v-else class="text-center mt-3 mb-3">
				<view class="btn btn-primary">加载更多</view>
			</view>
		</view>
		<!-- </scroll-view> -->
	</view>
</template>

<script>
	import $H from "@/common/free-lib/request.js";

	export default {
		data() {
			return {
				tabContents: [],
				form: {
					pageNo: 1,
					pageSize: 10,
					total: 0 // 总页数
				},
				hasMore: true, // 是否还有更多数据
			}
		},
		onPullDownRefresh() {
			this.form.pageNo = 1;
			this.tabContents = [];
			this.getAgricultureIntegralList();
		},
		onLoad() {
			this.getAgricultureIntegralList();
		},
		onReachBottom() {
			if (this.form.pageNo * this.form.pageSize >= this.form.total) {
				this.hasMore = false;
				return;
			}
			this.form.pageNo++;
			this.getAgricultureIntegralList();
		},
		methods: {

			getFullImageUrl(url) {
				return $H.getFullImageUrl(url);
			},
			getAgricultureIntegralList() {
				uni.showLoading({
					title: "加载中"
				})
				$H.get(
						"/basisInform/integral/upper/queryIntegralStandingsPageList", {
							...this.form
						}, {}
					)
					.then((res) => {
						uni.stopPullDownRefresh();
						uni.hideLoading();
						if (!res.result.records || res.result.records.length == 0) {
							uni.showToast({
								title: "没有更多数据啦",
								icon: "none"
							})
							return;
						}
						res.result.records.forEach((item) => {
							if (item.avatar) {
								item.avatarFull = this.getFullImageUrl(item.avatar);
							}
						});
						this.tabContents.push(...res.result.records);
						this.form.total = res.result.total;
						this.hasMore = this.tabContents.length < this.form.total;
					})
					.catch((error) => {
						uni.stopPullDownRefresh();
						uni.hideLoading();
						console.error("请求出错", error); // 处理任何错误
					});
			},
		}
	}
</script>

<style>
	.index-color-1 {
		font-size: 22px;
		color: #FF0000;
	}

	.index-color-2 {
		font-size: 22px;
		color: #17a2b8;
	}

	.index-color-3 {
		font-size: 22px;
		color: #FFC251;
	}
</style>